<template>
	<view>
		<view class="">
			<view class="loading" v-if="show">
				<view class="">
					<image class="loadingicon"
						src="../../static/all/loading.gif"
						mode="aspectFit"></image>
					<view style="color:#999;width: 100%;">加载中</view>
				</view>
			</view>
		</view>		
	</view>
 </template>
<script>
 
	export default {
		name: "loading",
		data() {
			return {
 
			};
		},
		props: {
			show: {
				default: false,
				type: Boolean
			},
			type: {
				default: 'FullScreen', //全屏使用或者自适应使用
				type: String
			}
		},
		watch: {
			show: {
				handler(newData, oldData) {
					console.log(newData, '新值');
					console.log(oldData, '老值');
				},
				immediate: true,
				deep: true
			}
		}
	}
</script>
 
<style >
		.loading {
			width: 100vw;
			height: 100vh;
			background: #fff;
			position: fixed;
			top: 0;
			left: 0;
			z-index: 999999;
			text-align: center;
			box-sizing: border-box;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-wrap: wrap;
	 
			
		}
		.loadingicon {
			width: 100rpx;
			height: 100rpx;
		}
	 
		.loading_adaptive {
			width: 100%;
			height: 500rpx;
			z-index: 999999;
			text-align: center;
			box-sizing: border-box;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-wrap: wrap;
	 
			
		}
		.loadingicon {
			width: 100rpx;
			height: 100rpx;
		}
</style>